<template name="newAdminPersonalization">
{{#let txt="admin.personalization.newAdminPersonalization"}}
  <h1>
    <ul class="admin-breadcrumbs">
      <li>{{#linkTo route="newAdminRoot"}}{{_ "admin.title"}}{{/linkTo}}</li>
      <li>{{_ "admin.personalization.name"}}</li>
    </ul>
  </h1>

  {{#if hasSuccess }}
    {{#focusingSuccessBox}}
      {{message}}
    {{/focusingSuccessBox}}
  {{/if}}

  {{#if hasError }}
    {{#focusingErrorBox}}
      {{message}}
    {{/focusingErrorBox}}
  {{/if}}

  <form class="admin-personalization-form">
    <div class="form-group">
      <label>
        {{_ (con txt "serverTitle.label")}}
        <input type="text" name="server-title" value="{{serverTitle}}" disabled="{{formDisabled}}"/>
      </label>
      <span class="form-subtext">
        {{_ (con txt "serverTitle.subtext")}}
      </span>
    </div>

    <div class="form-group">
      <label>
        {{_ (con txt "splashUrl.label")}}
        <input type="text" name="splash-url" value="{{splashUrl}}"
               placeholder="{{exampleSplashUrl}}" disabled="{{formDisabled}}"/>
      </label>
      <span class="form-subtext">
        {{{_ (con txt "splashUrl.subtext") serverUrl}}}
      </span>
    </div>

    <div class="form-group">
      <label>
        {{_ (con txt "signupDialog.label")}}
        <input type="text" name="signup-dialog" value="{{signupDialog}}"
               disabled="{{formDisabled}}"/>
      </label>
      <span class="form-subtext">
        {{_ (con txt "signupDialog.subtext")}}
      </span>
    </div>

    <div class="form-group">
      <label>
        {{_ (con txt "termsOfService.label")}}
        <input type="text" name="terms-of-service" value="{{termsOfServiceUrl}}"
               placeholder="{{_ (con txt "termsOfService.placeholder")}}" disabled="{{formDisabled}}"/>
      </label>
      <span class="form-subtext">
        {{_ (con txt "termsOfService.subtext")}}
      </span>
    </div>

    <div class="form-group">
      <label>
        {{_ (con txt "privacyPolicy.label")}}
        <input type="text" name="privacy-policy" value="{{privacyPolicyUrl}}"
               placeholder="{{_ (con txt "privacyPolicy.placeholder")}}" disabled="{{formDisabled}}"/>
      </label>
      <span class="form-subtext">
        {{_ (con txt "privacyPolicy.subtext")}}
      </span>
    </div>

    <h2>{{_ (con txt "whitelabeling.title")}}</h2>

    <div class="form-group">
      <label>
        {{_ (con txt "whitelabeling.logo.label")}}
      </label>
      {{#if logoError}}
        {{#focusingErrorBox}}
          {{logoError}}
        {{/focusingErrorBox}}
      {{/if}}
      <div class="logo" style="background-image: url('{{ logoUrl }}')"></div>
      {{#if customLogo }}
        <!-- show custom logo -->
      {{else}}
        <!-- show default -->
      {{/if}}
      <button type="button" name="reset-logo" disabled={{logoResetDisabled}}>{{_ (con txt "whitelabeling.logo.resetButton")}}</button>
      <button type="button" name="upload-logo">{{_ (con txt "whitelabeling.logo.uploadButton")}}</button>
      <input type="file" name="upload-file" style="display:none;" />
    </div>

    <div class="checkbox-group">
      <label>
        <input
          type="checkbox"
          name="hide-troubleshooting"
          checked="{{hideTroubleshootingChecked}}"
          disabled="{{formDisabled}}"
        />
        {{_ (con txt "whitelabeling.hideTroubleshooting.label")}}
      </label>
    </div>

    <div class="checkbox-group">
      <label>
        <input
          type="checkbox"
          name="hide-about"
          checked="{{hideAboutChecked}}"
          disabled="{{formDisabled}}"
        />
        {{_ (con txt "whitelabeling.hideAbout.label")}}
      </label>
    </div>

    <div class="checkbox-group">
      <label>
        <input
          type="checkbox"
          name="hide-send-feedback"
          checked="{{hideSendFeedbackChecked}}"
          disabled="{{formDisabled}}"
        />
        {{_ (con txt "whitelabeling.hideSendFeedback.label")}}
      </label>
    </div>

    <div class="checkbox-group">
      <label>
        <input
          type="checkbox"
          name="use-server-title-for-home-text"
          checked="{{useServerTitleForHomeTextChecked}}"
          disabled="{{formDisabled}}"
        />
        {{_ (con txt "whitelabeling.useServerTitleForHomeText.label")}}
      </label>
      <span class="form-subtext">
        {{_ (con txt "whitelabeling.useServerTitleForHomeText.subtext")}}
      </span>
    </div>

    <div class="form-group">
      <label>
        {{_ (con txt "whitelabeling.customLoginProviderName.label")}}
        <input
          type="text"
          name="custom-login-provider-name"
          value="{{customLoginProviderName}}"
          disabled="{{formDisabled}}"
        />
      </label>
      <span class="form-subtext">
        {{_ (con txt "whitelabeling.customLoginProviderName.subtext")}}
      </span>
    </div>

    <div class="button-row">
      <button type="submit" disabled="{{formDisabled}}">{{_ (con txt "saveButton")}}</button>
    </div>
  </form>
{{/let}}
</template>
